<!DOCTYPE html>
<html>
<head>
    <meta name="layout" content="main"/>
    <g:set var="entityName" value="${message(code: 'estate.label', default: 'estate')}"/>
    <asset:stylesheet src="styles/css/menu.css"/>
    <title>导入搜索</title>
    <style>
    .table > tbody > tr > td {
        vertical-align: middle;
    }
    .buttonbar{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .file_show{
        height: 20px;
        font: normal normal normal 14px/30px 'Microsoft YaHei';
    }
    @media screen and (min-width:1900px) and (max-width:1920px) {
        .flex{
            display: flex;justify-content: center;align-items: center;
        }
    }
    .select2-container .select2-choices .select2-search-field input, .select2-container .select2-choice, .select2-container .select2-choices{
        color: #999;
    }
    </style>
</head>

<body class="fixed-navbar fixed-sidebar">
<div class="small-header">
    <div class="hpanel">
        <div class="panel-body">
            <div id="hbreadcrumb" class="pull-right">
                <ol class="hbreadcrumb breadcrumb">
                    <li>CINDATA PLS</li>
                    <li class="active">
                        <span>导入</span>
                    </li>
                </ol>
            </div>

            <h2 class="font-light m-b-xs">
                导入
            </h2>
        </div>
    </div>
</div>

<div class="content animate-panel">
    <div class="row">
        <g:form method="POST" controller="contactImportBatch" action="searchEstate" class="form-horizontal" role="form">
            <div class="hpanel hblue">
                <div class="panel-heading">
                    <div class="panel-tools">
                        <button class="btn btn-primary btn-xs" type="submit"><i class="fa fa-search"></i>查询</button>
                        <button class="btn btn-warning2 btn-xs" type="button" id="resetBtn">
                            <i class="fa fa-times"></i>重置</button>
                    </div>
                    查询
                </div>
                <div class="panel-body seach-group">
                    <div class="row flex">
                        <div class="form-group col-md-4">
                            <label  class="col-sm-3 control-label">批次名</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" value="${params?.batchs}" id="batchs" name="batchs"  placeholder="请输入批次名"/>
                            </div>
                        </div>
                        <div class="form-group col-md-4">
                            <label class="col-md-3 control-label">经手人</label>
                            <div class="col-sm-9">
                                <g:select class="form-control" name="createBy" id="createBy"
                                          from="${com.cindata.User.list()}"
                                          valueMessagePrefix="createBy" optionKey="id" optionValue="fullName"
                                          value="${params?.createBy}"
                                          noSelection="${["": '请选择经手人']}"/>
                            </div>
                        </div>
                        <div class="form-group col-md-4">
                            <label for="district" class="col-sm-3 control-label">导入时间</label>
                            <div class="col-sm-9 input-daterange input-group " id="datepicker" style="width: 75%;">
                                <input type="text" class="form-control" placeholder="请选择导入时间"
                                       value="${params?.startDate}" name="startDate" id="startDateStart" style="text-align: left"/>
                                <span class="input-group-addon">至</span>
                                <input type="text" class="form-control" placeholder="请选择结束时间"
                                       value="${params?.endDate}" name="endDate" id="startDateEnd" style="text-align: left"/>
                            </div>
                        </div>
                    </div>
                </div>
        </g:form>
    </div>

    </div>

    <div class="row">
        <div class="hpanel hgreen">
            <div class="panel-heading">
                <div class="panel-tools">
                    <button class="btn btn-warning2 btn-xs" data-toggle="modal"
                            data-target="#myModal7"><i class="fa fa-plus"></i>导入</button>
                    <a class="showhide"><i class="fa fa-chevron-up"></i></a>
                </div>
                全部借款人
            </div>

            <div class="panel-body no-padding">
                <div class="table-responsive">
                    <table cellpadding="1" cellspacing="1" class="table table-striped table-bordered table-hover text-center">
                        <thead>
                        <tr>
                            <g:sortableColumn property="batchNumber" title="批次名" class="col-md-1 text-center"
                                              params="${params}"/>
                            <g:sortableColumn property="estateNum" title="总笔数" class="col-md-1 text-center"
                                              params="${params}"/>
                            <g:sortableColumn property="matchNum" title="成功笔数" class="col-md-1 text-center"
                                              params="${params}"/>
                            <g:sortableColumn property="status.name" title="处理状态" class=" col-md-1 text-center"
                                              params="${params}"/>
                            <g:sortableColumn property="createBy.fullName" title="经手人"
                                              class="col-md-1 text-center" params="${params}"/>
                            <g:sortableColumn property="createdDate" title="导入时间" class="col-md-1 text-center"
                                              params="${params}"/>
                            <g:sortableColumn property="operator" title="操作" class="col-md-1 text-center"
                                              params="${params}"/>
                        </tr>
                        </thead>
                        <tbody>
                        <g:each in="${estateImportBatchList}">
                            <tr align="center">
                                <td>
                                    <g:link controller="contactImport" style="color: #3498DB" action="searchImport" params="[id: it?.id]">${it?.batchNumber}</g:link>
                                </td>
                                <td>${it?.count}</td>
                                <td>${com.cindata.ContactImport.countByBatchAndEvaluateStatue(it, com.cindata.dictionary.ExecStatusDict.SUCCESS())}</td>
                                <td>${it?.status?.name}</td>
                                <td>${it?.createBy?.fullName}</td>
                                <td><g:formatDate date="${it?.createdDate}" format="yyyy-MM-dd "></g:formatDate></td>
                                <td>
                                    <g:if test="${it?.status?.name == '部分失败' || it?.status?.name == '失败'}">
                                        <g:link class="btn btn-danger btn-outline btn-xs" action="exportFailureContact" id="${it?.id}">导出失败押品</g:link>
                                    </g:if>
                                </td>
                            </tr>
                        </g:each>
                        </tbody>
                    </table>
                </div>
            </div>

            <div class="panel-footer">
                <div class="pagination">
                    <g:paginate total="${estateImportBatchCount ?: 0}" params="${params}"/>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade hmodal-success" id="myModal7" tabindex="-1" role="dialog" aria-hidden="true"
         data-backdrop="static">
        <div class="modal-dialog">
            <g:form controller="contactImportBatch" action="csvImport" method="post" enctype="multipart/form-data"
                    id="uploadForm" class="formDataLine" target="hiddenFrame">
                <div class="modal-content">
                    <div class="modal-body modalHeight">
                        <div class="form-horizontal">
                            <div class="form-group">
                                <label for="batch" class="col-md-2 control-label is-required" >批次名</label>
                                <div class="col-md-9">
                                    <input type="text" id="batch" name="batch" placeholder="请输入批次名" class="form-control">
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-md-2">
                                    <a href='javascript:void(0);' class="blueButton" style="line-height: 34px;font-size: 12px;">选择文件</a>
                                    <input type="file" class="myFileUpload" id="myFile" name="myFile" accept=".csv"/>
                                </div>
                                <div class="col-md-10" style="padding-left:25px;">
                                    <div id="file_div" class="file_show" ></div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="modal-footer">
                        <a class="pull-left" href="../assets/templateContact.zip"
                           style="font-weight:bold;text-decoration:none;color:#fff;" download>
                            <button type="button" class="btn btn-info">下载模板</button>
                        </a>
                        <button type="button" class="btn btn-success start" id="import" name="import">
                            <span>开始上传</span>
                        </button>
                        <button type="reset" class="btn btn-danger" data-dismiss="modal">
                            <span>取消上传</span>
                        </button>
                    </div>
                </div>
            </g:form>
        </div>
    </div>

</div>
%{--<div class="progress">
    <div class="m progressLine">
        <div class=" m-t-xs full progress-striped active progressLineC">
            <div class="progressLineWidth">上传进度</div>
            <div style="width: 90%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="90" role="progressbar" class=" progress-bar progress-bar-success">
                90%
            </div>
        </div>
        --}%%{--<div class="progressBtn">
            <button type="reset" class="btn btn-warning cancel" data-dismiss="modal">
                <span>取消上传</span>
            </button>
        </div>--}%%{--

    </div>
</div>--}%
<div class="modal fade hmodal-warning in" id="myModal9" tabindex="-1" role="dialog" aria-hidden="true"
     data-backdrop="static" style="display: none; padding-right: 17px;">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="color-line"></div>

            <div class="modal-body">
                <div class="m progressLine">
                    <div class=" m-t-xs full progress-striped active progressLineC">
                        <div class="progressLineWidth">上传进度</div>

                        <div aria-valuemax="100" aria-valuemin="0" aria-valuenow="90" role="progressbar"
                             class=" progress-bar progress-bar-success" id="progressLine">

                        </div>
                    </div>
                    %{--<div class="progressBtn">
                        <button type="reset" class="btn btn-warning cancel" data-dismiss="modal">
                            <span>取消上传</span>
                        </button>
                    </div>--}%

                </div>
            </div>
        </div>
    </div>
</div>
<iframe src="" name="hiddenFrame" style="display:none"></iframe>
<g:javascript>
    $(function () {
        /* //导入模板下载
         $("#download").click(function () {
         Window.open(src/main/webapp/download/templet.xls)
         })*/
        //导入功能按钮执行
        $("#import").click(function () {
            var myFile = $("#myFile").val();
            var ext_name = myFile.substr(myFile.lastIndexOf(".")+1);
            var file_ext_arr = [
                'csv'
            ];
            if (myFile == "") {
                $("#file_div").html("请选择文件");
                $("#file_div").css("color", "red");
            }
            if ($("#batch").val() == "") {
                $("#batch").parent().addClass("has-error");
            }
            else{
                $("#batch").parent().removeClass("has-error");
            }
            if ($("#batch").val() !== "" && myFile !== "" && file_ext_arr.indexOf(ext_name)>-1) {
                $(this).attr("type", "submit");
            }

        });


        //modal alert
        $(".myFileUpload").change(function () {
            var arrs = $(this).val().split('\\');
            var filename = arrs[arrs.length - 1];
            $("#file_div").html(filename);
            $("#file_div").css("color", "#3498db");
        });
        //导入弹出
        /*$('table').find('tbody').find('tr').on('click', function() {
         window.location.href("sdfg.jsp")
         });*/
        $('#datepicker').datepicker({
            language: 'zh-CN'
        });
        $("#datepicker").on("changeDate", function (event) {
            $("#my_hidden_input").val(
                    $("#datepicker").datepicker('getFormattedDate')
            )
        });

        // $('#esateTable').footable();

        $('.input-group.date').datepicker({});
        $('.input-daterange').datepicker({});

        $("#datepicker").on("changeDate", function (event) {
            $("#my_hidden_input").val(
                    $("#datepicker").datepicker('getFormattedDate')
            )
        });

    })
    //重置按钮
    $("#resetBtn").click(function () {
        $("#batchs").val("");
        $("#s2id_createBy span:first").html("请选择经手人");
        $("#createBy").val("");
        $("#s2id_status span:first").html("请选择处理状态");
        $("#status").val("");
        $("#s2id_importFileType span:first").html("请选择文件类型");
        $("#importFileType").val("");
        $("#s2id_evaluateType span:first").html("请选择处理方式");
        $("#evaluateType").val("");
        $("#startDateStart").val("");
        $("#startDateEnd").val("");
    });
    function importCallback(_param) {
        if (_param.success) {
            $("#myModal7").modal('hide');
            $("#myModal9").modal("show");
            var progressKey = {
                progressKey: _param.key
            };
            var flag = setInterval(function () {
                $.ajax({
                    type: "post",
                    url: "/contactImportBatch/getProgress",
                    data: progressKey,
                    async: false,
                    dataType: 'json',
                    success: function (data) {
                        var progress = data.progress.toFixed() + "%";
                        if (progress == "100%") {
                            clearInterval(flag);
                            $("#myModal9").modal("hide");
                            swal({
                                title: "导入成功",
                                type: "success"
                            }, function () {
                                window.location = window.location;
                            });
                        }
                        $("#progressLine").html(progress);
                        $("#progressLine").css("width", progress);
                    }
                })
            }, 1000);
        } else {
            $("#myModal7").modal("hide");
            swal({
                title: "导入失败",
                type: "error"
            });
        }
    }


    //删除数据
    $(document).delegate(".confirmBtn", "click",
        function() {
            var currentForm = $(this).parent("form");
            swal({
                    title: "处理失败押品是否转人工?",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    cancelButtonText: "不转人工",
                    confirmButtonText: "转为人工处理",
                    closeOnConfirm: false,
                    closeOnCancel: true
                },
                function(isConfirm) {
                    if (isConfirm) {
                        currentForm.submit();
                        swal("已转为人工处理！", "", "success");
                    }
                });
        });

</g:javascript>
<asset:javascript src="homer/vendor/jquery-validation/jquery.validate.min.js"/>
</body>
</html>
